<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>光谱管理</title>
        <%-- 全站样式 --%>
        <jsp:include page="/WEB-INF/jsps/template_style.jsp"></jsp:include>
        
        <link rel="shortcut icon" href="assets/img/favicon.ico">
        <link rel="stylesheet" href="assets/css/bootstrap-datetimepicker.min.css">

        <!--文件夹所需js、css-->
        <link rel="stylesheet" href="../assets/css/folder/folder.css">
      

    </head>

    <body>
        <div class="page-container">
           <%--侧边栏 --%>
		   <jsp:include page="/WEB-INF/jsps/sidebar.jsp"></jsp:include>   

            <div class="main-content">
                <%--导航栏 --%>
		        <jsp:include page="/WEB-INF/jsps/navbar.jsp"></jsp:include>   
                <div class="page-title">
                    <div class="title-env">
                        <h1 class="title">光谱收藏夹</h1>
                        <p class="description">
                            您可以在此页面上对光谱文件夹进行操作&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <strong class="pull-right">（使用空间：3MB&nbsp;&nbsp;&nbsp;总空间：16MB）</strong>
                        </p>
                    </div>
                </div>
                <!--光谱文件夹栏目-->
                <div class="panel">
                    <!-- 工具栏 -->
                    <div class="row fontawesome-icon-list gray">
                        <div class="fa-hover col-md-2" id="create">
                            <a class="btn btn-default"><i class="fa-cloud-upload"></i>新建文件夹</a>
                        </div>
                        <div class="fa-hover col-md-2 upload1" data-toggle="modal" data-target="#uploadmodal">
                            <a class="btn btn-default "><i class="fa-upload"></i>上传本地光谱</a>
                        </div>

                    </div>
                    <!-- 收藏夹 -->
                    <section class="mailbox-env">
                        <!-- data-curFavoriteID表示当前显示的收藏夹的ID -->
                        <!-- data-userID表示当前用户ID -->
                        <div class="panel-body panel-border">
                            <table class="favoriteTable table table-hover" data-userID="3">
                                <thead>
                                <tr>
                                    <th class="col-sm-6">名称</th>
                                    <th class="col-sm-3"></th>
                                    <th class="col-sm-3">时间</th>
                                </tr>
                                </thead>
                                <tbody>
                                   <c:choose>
                                       <c:when test="${dirStatus.equals('0')}">
                                           <tr class="favorite" data-favoriteID="2" style="cursor:pointer">
                                               <td><span style="color:red;">${dirEmpty}</span></td>
                                               <td></td>
                                               <td></td>
                                           </tr>
                                       </c:when>
                                       <c:otherwise>
                                           <c:forEach var="dir" items="${spectrumDir}">
                                            <tr class="favorite" data-favoriteID="2" style="cursor:pointer">
                                                <td class="favoriteName" data-favoriteID="2">
                                                    <input type="hidden" name="DirID" value="${dir.id}">
                                                    <i class="fa-folder-o"></i><a href="spectrumFile.do?fileId=${dir.id}">&nbsp;&nbsp;${dir.fileName}</a>
                                                </td>
                                                <td class="favoriteTool">
                                                    <ul class="album-options list-unstyled list-inline hover" style="display:none">
                                                        <li>
                                                            <a class="rename" href="#">
                                                                <i class="fa-edit"></i>重命名
                                                            </a>
                                                        </li>
                                                        <li>
                                                            <a class="deleteFavorite" href="#">
                                                                <i class="fa-trash"></i>删除
                                                            </a>
                                                        </li>
                                                    </ul>
                                                </td>
                                                <td class="favoriteCreateTime">${dir.createTime}</td>
                                            </tr>
                                           </c:forEach>
                                       </c:otherwise>
                                   </c:choose>
                                </tbody>
                            </table>
                        </div>
                    </section>
                </div>

  
            </div>
        </div>
        <!-- 模态框（Modal） -->
        <!--上传光谱开始-->
        <div class="modal fade" id="uploadmodal">
            <div class="modal-dialog" >
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" >上传本地光谱</h4>
                    </div>
                    <div class="modal-body">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">请填写上传信息</h3>
                            </div>
                            <div class="panel-body">
                                <form action="/upload/spectrum.do" role="form" class="form-horizontal" method="post" enctype="multipart/form-data">
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label" for="pluginName">光谱名称 <font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <input type="text" class="form-control" name="spectrumName" id="pluginName" placeholder="请填写您的光谱名称" maxlength="16" required>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label" for="pluginName">被检测物产地<font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <input type="text" class="form-control" name="categoryOrigin" id="categoryOrigin" placeholder="请填写被检测物产地" maxlength="16" required>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label" for="pluginName">被检测物<font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <select class="form-control" name="detectedName" id="detect" required>
                                               <c:forEach var="obj" items="${detectedObject}">
                                                  <option value="${obj.detectedID}">${obj.detectedName}</option>
                                               </c:forEach>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">光谱类型 <font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <select class="form-control" name="spectrumType" id="spectrumType" required>
                                              <%--遍历光谱类型--%>
                                                <c:forEach var="type" items="${spectrumType}">
                                                    <option value="${type.Id}">${type.spectrumType}</option>
                                               </c:forEach>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">XUnit<font color="red">*</font></label>
                                        <div class="col-sm-3">
                                            <select class="form-control" name="XUnit" id="XUnit" required>
                                                <option value="WAVE_NUMBER">波数</option>
                                                <option value="NANOMETER ">纳米</option>
                                                <option value="MICRON ">微米</option>
                                            </select>
                                        </div>
                                        <label class="col-sm-1 control-label" style="margin-left: -28px;">YUnit<font color="red">*</font></label>
                                        <div class="col-sm-3">
                                            <select class="form-control" name="YUnit" id="YUnit" required>
                                                <option value="ABSORBANCE">吸光度</option>
                                                <option value="ABSORBANCE_DIFFERENCE">吸光度差值</option>
                                                <option value="PERCENT_LIGHT_TRANSMISSION_SPECTRUM">%透光谱</option>
                                                <option value="PERCENT_REFLECTIVITY ">%反射率</option>
                                                <option value="PHOTOACOUSTIC ">光声</option>
                                                <option value="LOG">Log(1/R)</option>
                                                <option value="KUBELKA_MUNK ">Kubelka-Munk</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">存放位置<font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <select class="form-control" name="dirName" id="dirType" required>
                                            <%-- 遍历上传文件夹--%>
                                              <c:choose>
                                                  <c:when test="${dirStatus.equals('0')}">
                                                      <option >您没有文件夹请先新建</option>
                                                  </c:when>
                                                  <c:otherwise>
                                                      <c:forEach var="Dir" items="${spectrumDir}">
                                                          <option value="${Dir.id}">${Dir.fileName}</option>
                                                      </c:forEach>
                                                  </c:otherwise>
                                              </c:choose>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label" for="description">光谱描述 <font color="red">*</font></label>
                                        <div class="col-sm-6">
                                            <textarea class="form-control autogrow" cols="5" name="spectrumDescription" id="description" placeholder="请填写您的光谱描述" maxlength="200" required></textarea>
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">光谱文件（.txt） <font color="red">*</font></label>
                                        <div class="col-sm-8">
                                            <input type="file" id="up_file" name="up_file" class="col-sm-8" onchange="fileChange(this);" />
                                        </div>
                                    </div>
                                    <div class="form-group-separator"></div>
                                    <div class="form-group col-sm-6 pull-right" >
                                        <input id="submit_upload" type="submit" class="btn btn-primary" value="上传" disabled />
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--上传光谱结束-->
        <%--页脚 --%>
        <jsp:include page="/WEB-INF/jsps/footer.jsp"></jsp:include> 
       
          <script src="assets/js/folder/folder.js"></script>
        <script src="assets/js/folder/BootstrapMenu.min.js"></script>
       
         <!-- Bottom Scripts -->
        <script src="assets/js/bootstrap-datetimepicker.js"></script>
        <script src="assets/js/bootstrap-datetimepicker.zh-CN.js"></script>
        <!-- Imported scripts on this page -->
        <!-- <script src="assets/js/jquery-ui.min.js"></script> -->
        <!-- JavaScripts initializations and stuff -->
        <script src="assets/js/userFavorite.js"></script>
        <%--JavaScript for upload--%>
        <script src="assets/js/custom/uploadFile.js"></script>
         <%-- 尾部内容 --%>
        <jsp:include page="/WEB-INF/jsps/template_tail.jsp"/>
    </body>
</html>